
.client-container {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.set{
    width: 30px;
    height: 600px;
    background-color: rgba(50, 55, 61);
    display: flex;
    flex-direction: column;
    border-top-left-radius: 5px; 
    border-bottom-left-radius: 5px;
    z-index: 2;
}

.set .set-1{
    width: 30px;
    height: 30px;
    margin: 0 auto;
    background-repeat: no-repeat;
    background-size: 20px 20px;
    background-position: center center;
}

.set .set-2{
    width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    background-size: 20px 20px;
    background-position: center center;
}

.main {
    width: 700px;
    height: 600px;
    background-color: rgb(238, 238, 238);

    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;

    display: flex;
    padding-top: 3%;
    padding-left: 5%;
    z-index: 2;
}

.cover {
    width: 100%;
    height: 100%;

    background-image: url(../pic/backdrop.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;

    /* 为了让 .cover 和 .main 能够重叠, 给 .cover 加上个定位属性 */
    position: absolute;
    top: 0;
    left: 0;

    /* 设置了下 z 轴坐标 */
    z-index: 1;

    /* 使用 css 滤镜效果, 让背景图变的朦胧起来 */
    filter: blur(40px);
}


.main .content {
    width: 100%;
    height: 100%;
    display: flex;
    
    flex-direction: column;
}
.content .name{
    height: 80px;
    display: flex;
    align-items: center;
}
.content .name p{
    font-weight: bold;
}
.content .name input{
    height: 30px;
    border-radius: 5px;
}

.content .save {
    height: 30px;
    width: 100px;
    color:azure;
    background-color: yellowgreen;
    border-radius: 5px;
    margin-right: 20px;
    margin-left: auto;
    margin-top: auto;
    margin-bottom: 30px;
}

.content .save:active {
    background-color:rgb(195, 244, 244);
}
.content .photo {
    height: 290px;
    align-items: center;
    display: flex;
}
.content .photo p{
    font-weight: bold;
}

.content .password {
    height: 80px;
    align-items: center;
    display: flex;
}
.content .password p{
    font-weight: bold;
}
.content .password input{
    height: 30px;
    border-radius: 5px;
}